<page-header [title]="title" [subTitle]="subTitle"></page-header>

<div class="panel panel-default">
    <div class="panel-body">
        <div class="form-horizontal">
            <div class="form-group">
                <label class="col-sm-2 control-label text-right">推送内容：</label>
                <div class="col-sm-6">
                    <input type="text" [(ngModel)]="pushMessage.content" class="form-control">
                </div>
                <div class="col-sm-2">
                    <select class="form-control" [(ngModel)]="pushMessage.type">
                        <option value="0">所有用户</option>
                        <option value="1">部分用户</option>
                    </select>
                </div>
                <div class="col-sm-2">
                    <button type="button" class="btn btn-primary" (click)="notifyMessage()">发送</button>
                </div>
            </div>
            <div class="form-group" *ngIf="pushMessage.type == 1">
                <label class="col-sm-2 control-label text-right">搜索用户：</label>
                <div class="col-sm-4">
                    <input type="text" [(ngModel)]="queryParams.userNick" class="form-control" placeholder="昵称">
                </div>
                <div class="col-sm-4">
                    <input type="text" [(ngModel)]="queryParams.phone" class="form-control" placeholder="电话">
                </div>
                <div class="col-sm-2">
                    <button type="button" class="btn btn-primary" (click)="searchUser()">查询</button>
                </div>
            </div>
            <div class="form-group" *ngIf="pushMessage.type == 1">
                <label class="col-sm-2 control-label text-right"></label>
                <div class="col-sm-10">
                    <table class="table table-condensed ">
                        <tr *ngFor="let item of userList">
                            <td>
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" [checked]="item.checked" (click)="selectUser(item)">
                                        {{item.userNick}}
                                    </label>
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
            <div class="form-group" *ngIf="selectedUserList.length>0">
                <label class="col-sm-2 control-label text-right">已选用户：</label>
                <div class="col-sm-10">
                    <div class="col-xs-2" *ngFor="let item of selectedUserList">
                        <div class="bg-warning well well-sm">{{item.userNick}}
                            <button type="button" (click)="removeSelectedUser(item)" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>